<!DOCTYPE html>
<html xmlns:th="https://www.thymeleaf.org/">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="/jquery-3.4.1.min.js"></script>
    <script>
        $(function(){
            $("#a1").click(function(){
               let id = $(this).attr("data-id");
               console.log("id:"+id);
            });
        });
    </script>
</head>
<body>
<h1>Hello Thymeleaf</h1>
<h1>取request作用域值</h1>
[[${msg}]]
[(${msg})]
<span th:text="${msg}"></span>
<span th:utext="${msg}"></span>
<h1>取session作用域的值</h1>
<span th:text="${session.user.username}"></span>
<h1>取application作用域的值</h1>
<span th:text="${application.user.username}"></span>
<h1>属性赋值</h1>
<!--
    当需要为HTML元素的某一个属性赋值,其值是作用域中的数据时
    为该属性添加th前缀即可
    只有拥有th前缀的属性,其值才能从作用域中获取
    否则只会作为普通字符串展现
-->
<a id="a1" href="javascript:;" th:data-id="${id}">修改-[[${id}]]</a>
<h1>if判断标签</h1>
<span th:if="${age < 5}">婴儿</span>
<span th:if="${age < 18}">少年</span>
<span th:if="${age < 30}">青年</span>
<span th:if="${age < 60}">中年</span>
<span th:if="${age >= 60}">老年</span>
<h1>unless判断标签</h1>
<span th:unless="${age < 5}">婴儿</span>
<span th:unless="${age < 18}">少年</span>
<span th:unless="${age < 30}">青年</span>
<span th:unless="${age < 60}">中年</span>
<span th:unless="${age >= 60}">老年</span>

<h1>switch判断</h1>
<span th:switch="${role}">
    <!--<span th:case="student">学生</span>-->
    <span th:case="user">用户</span>
    <span th:case="staff">员工</span>
    <span th:case="member">会员</span>
    <span th:case="programmer">程序员</span>
    <span th:case="businessman">商人</span>
    <span th:case="*">其他</span>
</span>

<h1 id="hh">遍历操作</h1>
<table border="1">
    <tr>
        <th>序号</th>
        <th>编号</th>
        <th>用户名</th>
        <th>密码</th>
        <th>操作</th>
    </tr>
    <tr th:each="user,i:${users}">
        <td>[[${i.index + 1}]]</td>
        <td>[[${user.id}]]</td>
        <td th:text="${user.username}"></td>
        <td th:text="${user.password}"></td>
        <td>
            <a href="javascript:;">修改</a>
            <a href="/hello/f2" onclick="return confirm('是否确认删除')">删除</a>
        </td>
    </tr>
</table>

<h1>设置默认值</h1>
<form action="">
    编号:<input type="text" th:value="${user.id}"/><br/>
    用户名:<input type="text" th:value="${user.username}"/><br/>
    密码:<input type="password" th:value="${user.password}"/><br/>
    <input type="submit" value="修改">
</form>

<h1>设置默认值</h1>
<form action="">
    编号:<input type="text" th:field="${user.id}"/><br/>
    用户名:<input type="text" th:field="${user.username}"/><br/>
    密码:<input type="password" th:field="${user.password}"/><br/>
    <input type="submit" value="修改">
</form>

<h1>设置默认值</h1>
<form action="" th:object="${user}">
    编号:<input type="text" th:field="*{id}"/><br/>
    用户名:<input type="text" th:field="*{username}"/><br/>
    密码:<input type="password" th:field="*{password}"/><br/>
    <input type="submit" value="修改">
</form>



















<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
</body>
</html>